<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<script src="layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="js/vue.js"></script>
<title>Insert title here</title>
</head>
<body>
	<div>
		<i class="layui-icon" style="font-size: 25px; color: #1E9FFF;">&#xe614;</i>
		<h2 style="display: inline;">
			系统管理<i class="layui-icon" style="font-size: 20px; color: #1E9FFF;">&#xe65b;</i>
			文件上传管理
		</h2>
	</div>
	<p>&nbsp;</p>
	<form class="layui-form">
		<!-- 提示：如果你不想用form，你可以换成div等任何一个普通元素 -->
		<div class="layui-form-item" id="div">
			<label style="width: 100px;" class="layui-form-label">文件上传最大值(MB)</label>
			<div class="layui-input-inline">
				<input id="size" :value="size" type="text" name="username"
					lay-verify="required" placeholder="请输入" autocomplete="off"
					class="layui-input">
			</div>
		</div>

		<div class="layui-form-item">
			<label class="layui-form-label">文件格式</label>
			<div class="layui-input-block">
			
				<input type="checkbox" name="" title="doc" value="doc"> <input
					type="checkbox" name="" title="docx" value="docx"> <input
					type="checkbox" name="" title="xls" value="xls"> <input
					type="checkbox" name="" title="xlsx" value="xlsx"> <br>
				<br> <input type="checkbox" name="" title="ppt" value="ppt">
				<input type="checkbox" name="" title="rar" value="rar"> 
				<input type="checkbox" name="" title="pdf" value="pdf"> 
				<input type="checkbox" name="" title="txt" value="txt"><br>
			</div>
			<br>
				<label class="layui-form-label">图片格式</label>
			<div class="layui-input-block">
				<input type="checkbox" name="" title="jpg" value="jpg">
				<input type="checkbox" name="" title="png" value="png">
				<input type="checkbox" name="" title="jpeg" value="jpeg">
			</div>
		</div>


		<div id="but" class="layui-form-item">
			<div class="layui-input-block">
				<button type="button" id="save" class="layui-btn">保存</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
		<!-- 更多表单结构排版请移步文档左侧【页面元素-表单】一项阅览 -->
	</form>

	<script type="text/javascript">
		layui.use('form', function() {
			var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功

			form.render();
		});
		var vue = new Vue({
			el : "#div",
			data : {
				size : '',
			},
			methods : {

			}

		});//	
		$(function() {
			//查 询
			$.ajax({
				url : '../file/queryFileSet',
				type : 'post',
				data : {},
				async : false,
				dataType : "json",
				success : function(result) {
					console.log(result);
					console.log(result.array);

					vue.size = result.size;
					$.each(result.array, function(index, ele) {
						console.log(ele);
						$("input[type='checkbox']").each(function() {
							if (ele == $(this).val()) {
								$(this).attr("checked", true);
							}

						});
					}); //each
				}

			});
		});

		$("#save").click(function() {
			var arr = [];
			var size = $("#size").val();

			$("input[type='checkbox']:checked").each(function(i) {
				arr[i] = $(this).val();
			});

			console.log(arr);
			$.ajax({
				url : '../file/updateFileSet',
				type : 'post',
				data : {
					"size" : size,
					"arr" : arr

				},
				dataType : "text",
				success : function(result) {
					if (result == "success") {
						alert("保存成功");
					}
				}

			});//ajax
		});
	</script>
</body>
</html>